<template>
  <div class="item" @click="goodsDetail">
    <div class="info" :style="{'top':goodsPos.item01}">
      <div class="price">￥{{goodsInfo.flash_price}}</div>
      <div class="name">{{goodsInfo.goods_name}}</div>
    </div>
    <div class="picture" :style="{'top':goodsPos.item02}">
      <img v-lazy="{src:goodsInfo.img640_url,loading:lazyPic}">
    </div>
  </div>
</template>

<script>
  export default {
    props:['goodsInfo','type'],
    data(){
      return{
        lazyPic:require('../../../assets/img/publicImg/loading_default.png') 
      }
    },
    computed:{
      goodsPos(){
        let pos= {item01:'0rem',item02:'1rem'};
        if(this.type=='type02'){ pos.item01='2.15rem';pos.item02='0rem';}
        return pos;
      }
    },
    methods:{
      goodsDetail(){
        this.$emit('childEvent',this.goodsInfo.goods_id);
      }
    }
  }
</script>

<style lang="less" scoped>
.item{
  height: 3.15rem;
  position: relative;
  .picture{
    position: absolute;
    left: 0;
  }
  .info{
    position: absolute;
    left: 0;
    .price{
      font-family: '微软雅黑';
      line-height: 0.4rem;
    }
    .name{
      height: 0.5rem;
      line-height: 0.26rem;
      overflow: hidden;
      margin-bottom: 0.1rem
    }  
  }
}
</style>